<div class="layuimini-container layui-anim layui-anim-upbit">
    <div class="layuimini-main">

        <div style="margin-top:5px">
            <button class="layui-btn layui-btn-sm data-add-btn"> 添加Mod </button>
        </div>

        <table class="layui-hide" id="modTable" lay-filter="modTableFilter"></table>
    </div>
</div>

<script>
    layui.use(['form', 'table','layuimini', 'upload', 'readClusterLog', 'clusterEditor'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table,
            upload = layui.upload,
            readClusterLog = layui.readClusterLog,
            clusterEditor = layui.clusterEditor,
            layuimini = layui.layuimini;

        window.modTable = table.render({
            elem: '#modTable',
            url: 'api/mod_table.json',
            // toolbar: '#toolbar',
            defaultToolbar: ['filter'],
            cols: [[
                { field: '__modId', title: 'MODID', width: 120 },
                { field: 'name', title: '名称', width: 300  },
                { field: 'version', title: '版本', width: 100 },
                { field: 'author', title: '作者', width: 150 },
                { field: 'description', title: '描述' }
            ]],
        });

        // 监听添加操作
        $(".data-add-btn").on("click", function () {
            layer.prompt({
                title: '请输入MODID',
            }, function (value, index, elem) {
                doMod({
                    mod_id: value,
                    force: false,
                }, function () {
                    layer.close(index);
                });
            });
        });

        function doMod(dataFir, callback) {
            var loadIndex = layer.load();
            $.ajax({
                url: '/api/download_mod',
                type: 'POST',
                dataType: 'JSON',
                data: dataFir,
                success: function (data) {
                    layer.close(loadIndex);
                    if (-1 == data.code) {
                        layer.open({
                            title: '提示',
                            content: data.msg,
                            btn: ['确定', '取消'],
                            yes: function (index, layero) {
                                layer.close(index);
                                doMod({
                                    mod_id: dataFir.mod_id,
                                    force: true
                                }, callback);
                            }
                        });
                        return;
                    } else if (data.code) {
                        layer.open({
                            title: '提示',
                            content: data.msg
                        });
                        return;
                    }
                    layer.msg(data.msg);
                    window.modTable.reload();
                    callback();
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    layer.close(loadIndex);
                    layer.open({
                        title: '提示',
                        content: '糟糕，出问题了。'
                    });
                }
            });
        }
    });
</script>